<div>
    <div class="row">
        <div class="col-md-2 " style="padding-right:0px;height: 95%; overflow-x: hidden; overflow-y: scroll;">
            <vc:create path="community/communityRoomTree" ></vc:create>
        </div>
        <div class="col-md-10">
            <div class="  white-bg">
                <div class="ibox ">
                    <div class="ibox-title">
                        <h5 class="flex justify-start">
                            {{adminRoomFeeInfo.roomName}}
                        </h5>
                        <div class="ibox-tools" style="top:10px;">

                        </div>
                    </div>
                    <div class="ibox-content">
                        <div class="row ">
                            <div class="col-sm-2">
                                <div class="form-group">
                                    <input type="text" :placeholder="vc.i18n('房屋编号,如1-1-1123','adminRoomFee')"
                                        v-model.trim="adminRoomFeeInfo.condition.roomNum"
                                        class=" form-control form-control-sm" @blur="listRoomInAdminRoomFee()">
                                </div>
                            </div>
                            <div class="col-sm-2">
                                <input type="text" :placeholder="vc.i18n('请填写业主名称','adminRoomFeeInfo')"
                                    @input="_inputRoomByOwner()" v-model.trim="adminRoomFeeInfo.condition.ownerName"
                                    class=" form-control form-control-sm">
                            </div>
                            <div class="col-sm-2">
                                <button type="button" class="btn btn-primary btn-sm"
                                    v-on:click="_queryAdminRoomFeeMethod()">
                                    <vc:i18n name="查询" namespace="room"></vc:i18n>
                                </button>
                                <button type="button" class="btn btn-white btn-sm"
                                    v-on:click="_resetAdminRoomFeeMethod()">
                                    <vc:i18n name="重置" namespace="room"></vc:i18n>
                                </button>
                            </div>
                        </div>

                        <div class="">
                            <ul class="nav nav-tabs">
                                <li class="nav-item">
                                    <a class="nav-link"
                                        v-bind:class="{active:adminRoomFeeInfo._currentTab == 'aRoomDetailRoomFee'}"
                                        v-on:click="changeTab('aRoomDetailRoomFee')">
                                        <vc:i18n name="房屋费用" namespace="adminRoomFee"></vc:i18n>
                                    </a>
                                </li>
                                <li class="nav-item" v-if="adminRoomFeeInfo.ownerId">
                                    <a class="nav-link"
                                        v-bind:class="{active:adminRoomFeeInfo._currentTab == 'aRoomDetailHisFee'}"
                                        v-on:click="changeTab('aRoomDetailHisFee')">
                                        <vc:i18n name="缴费历史" namespace="adminRoomFee"></vc:i18n>
                                    </a>
                                </li>
                                <li class="nav-item" v-if="adminRoomFeeInfo.ownerId">
                                    <a class="nav-link"
                                        v-bind:class="{active:adminRoomFeeInfo._currentTab == 'aRoomDetailRoom'}"
                                        v-on:click="changeTab('aRoomDetailRoom')">
                                        <vc:i18n name="房屋" namespace="adminRoomFee"></vc:i18n>
                                    </a>
                                </li>
                                <li class="nav-item" v-if="adminRoomFeeInfo.ownerId">
                                    <a class="nav-link"
                                        v-bind:class="{active:adminRoomFeeInfo._currentTab == 'aRoomDetailOwner'}"
                                        v-on:click="changeTab('aRoomDetailOwner')">
                                        <vc:i18n name="业主" namespace="adminRoomFee"></vc:i18n>
                                    </a>
                                </li>
                                <li class="nav-item">
                                    <a class="nav-link"
                                        v-bind:class="{active:adminRoomFeeInfo._currentTab == 'aRoomFeeCallable'}"
                                        v-on:click="changeTab('aRoomFeeCallable')">
                                        <vc:i18n name="催缴" namespace="adminRoomFee"></vc:i18n>
                                    </a>
                                </li>
                                <li class="nav-item">
                                    <a class="nav-link"
                                        v-bind:class="{active:adminRoomFeeInfo._currentTab == 'aRoomDetailReceipt'}"
                                        v-on:click="changeTab('aRoomDetailReceipt')">
                                        <vc:i18n name="收据" namespace="adminRoomFee"></vc:i18n>
                                    </a>
                                </li>

                                <li class="nav-item">
                                    <a class="nav-link"
                                        v-bind:class="{active:adminRoomFeeInfo._currentTab == 'aRoomDetailMeterWaterLog'}"
                                        v-on:click="changeTab('aRoomDetailMeterWaterLog')">
                                        <vc:i18n name="抄表记录" namespace="adminRoomFee"></vc:i18n>
                                    </a>
                                </li>
                                <li class="nav-item" v-if="adminRoomFeeInfo.ownerId">
                                    <a class="nav-link"
                                        v-bind:class="{active:adminRoomFeeInfo._currentTab == 'aOwnerDetailAccount'}"
                                        v-on:click="changeTab('aOwnerDetailAccount')">
                                        <vc:i18n name="预存账户" namespace="adminRoomFee"></vc:i18n>
                                    </a>
                                </li>
                                <li class="nav-item" v-if="adminRoomFeeInfo.ownerId">
                                    <a class="nav-link"
                                        v-bind:class="{active:adminRoomFeeInfo._currentTab == 'aOwnerDetailAcctReceipt'}"
                                        v-on:click="changeTab('aOwnerDetailAcctReceipt')">
                                        <vc:i18n name="预存补打" namespace="adminRoomFee"></vc:i18n>
                                    </a>
                                </li>
                                <li class="nav-item">
                                    <a class="nav-link"
                                        v-bind:class="{active:adminRoomFeeInfo._currentTab == 'aRefundDeposit'}"
                                        v-on:click="changeTab('aRefundDeposit')">
                                        <vc:i18n name="押金" namespace="adminRoomFee"></vc:i18n>
                                    </a>
                                </li>
                                <!-- <li class="nav-item">
                                    <a class="nav-link"
                                        v-bind:class="{active:adminRoomFeeInfo._currentTab == 'feeDetailFeeRule'}"
                                        v-on:click="changeTab('feeDetailFeeRule')">
                                        <vc:i18n name="账单规则" namespace="feeDetail"></vc:i18n>
                                    </a>
                                </li>
                                <li class="nav-item">
                                    <a class="nav-link"
                                        v-bind:class="{active:adminRoomFeeInfo._currentTab == 'feeDetailRuleBill'}"
                                        v-on:click="changeTab('feeDetailRuleBill')">
                                        <vc:i18n name="费用账单" namespace="feeDetail"></vc:i18n>
                                    </a>
                                </li> -->
                            </ul>
                        </div>
                        <div v-if="adminRoomFeeInfo._currentTab == 'aRoomDetailRoomFee'">
                            <vc:create path="community/aRoomDetailRoomFee"></vc:create>
                        </div>
                     
                        <div v-if="adminRoomFeeInfo._currentTab == 'aRoomDetailHisFee'">
                            <vc:create path="community/aRoomDetailHisFee"></vc:create>
                        </div>
                      
                        <div v-if="adminRoomFeeInfo._currentTab == 'aRoomDetailRoom'">
                            <vc:create path="community/aRoomDetailRoom"></vc:create>
                        </div>
                        
                        <div v-if="adminRoomFeeInfo._currentTab == 'aRoomDetailOwner'">
                            <vc:create path="community/aRoomDetailOwner"></vc:create>
                        </div>
                        
                        <div v-if="adminRoomFeeInfo._currentTab == 'aRoomDetailMeterWaterLog'">
                            <vc:create path="community/aRoomDetailMeterWaterLog"></vc:create>
                        </div>
                  
                        <div v-if="adminRoomFeeInfo._currentTab == 'aRoomDetailReceipt'">
                            <vc:create path="community/aRoomDetailReceipt"></vc:create>
                        </div>
                      
                        <div v-if="adminRoomFeeInfo._currentTab == 'aOwnerDetailAccount'">
                            <vc:create path="owner/aOwnerDetailAccount"></vc:create>
                        </div>         
                        <div v-if="adminRoomFeeInfo._currentTab == 'aOwnerDetailAcctReceipt'">
                            <vc:create path="owner/aOwnerDetailAcctReceipt"></vc:create>
                        </div>
                        <div v-if="adminRoomFeeInfo._currentTab == 'aRoomFeeCallable'">
                            <vc:create path="fee/aRoomFeeCallable"></vc:create>
                        </div>
                      
                        <div v-if="adminRoomFeeInfo._currentTab == 'aRefundDeposit'">
                            <vc:create path="fee/aRefundDeposit"></vc:create>
                        </div>
  <!-- 
                        <div v-if="adminRoomFeeInfo._currentTab == 'feeDetailFeeRule'">
                            <vc:create path="fee/feeDetailFeeRule"></vc:create>
                        </div>
                        <div v-if="adminRoomFeeInfo._currentTab == 'feeDetailRuleBill'">
                            <vc:create path="fee/feeDetailRuleBill"></vc:create>
                        </div> -->

                    </div>
                </div>
            </div>
        </div>
    </div>
</div>